<template>
	<div>
		<table border="1px" class="tale" style="width:93.5%;position:relative;left:4%">
			<tr align="center" class="tale_title">
				<th>
					<label class="myLabel">所属系统</label>
				</th>
				<th>
					<label class="myLabel">姓名</label>
				</th>
				<th>
					<label class="myLabel">已有的一级4A主账号</label>
				</th>
				<th>
					<label>联系方式</label>
				</th>
				<th>
					<label>工作职责</label>
				</th>
				<th>
					<label>组织名称</label>
				</th>
				<td v-if="!print">
					<Button v-if="!ifedit" type="primary" size="small" @click="addRow">新增</Button>
				</td>
			</tr>
			<template v-for="(item, index) in people">
				<tr align="center" style="height:50px" :key="index">
					<td>
						<span v-if="ifedit">{{people[index].sysName}}</span>
						<Select v-else v-model="people[index].sysId" :label-in-value="true" :transfer="true" filterable style="width:90%"
						 @on-change="selectSys($event, index)" @on-open-change="isContained(people[index].selectTypes)">
							<Option v-for="item in sysList" :value="item.id" :key="item.id" :disabled="item.isDisabled" :label="item.sysName">
								<Tooltip max-width="300" placement="right-end" :transfer="true" style="white-space: nowrap;">
									<p style="width: 100%;">{{item.sysName}}</p>
									<div slot="content" style="font-size:0;">
										<template v-if="item.accountTypes == undefined || item.accountTypes == null || item.accountTypes.length<1">
											<p class="p_content">该系统没有可选账号类型，请先配置!</p>
										</template>
										<template v-else>
											<p class="p_content">该系统可选择的账号类型有:</p>
											<template v-for="(value,i) in item.accountTypes">
												<p class="p_content">{{value}}</p>
											</template>
										</template>
									</div>
								</Tooltip>
							</Option>
						</Select>
					</td>
					<td style="width:14%">
						<span v-if="ifedit">{{people[index].peopleName}}</span>
						<component v-else ref="inputSearch"  :dataList="peopleList"  :checkLable="people[index].peopleUserId" :is="'inputSearch'"
						  :multiple="false" @on-change="changePeople($event,index)" style="width:90%"></component>
					</td>
					<td>
						<!--                         <Form ref="people[index]" :model="people[index]" label-position="left" :label-width="0">
                      <FormItem> -->
						<span v-if="ifedit">{{people[index].fourA}}</span>
						<Input v-else style="width: 90%;" v-model="people[index].fourA" placeholder="请填写已有的4A账号"></Input>
						<!--                         </FormItem>
                      </Form> -->
					</td>
					<td>
						<span v-if="ifedit">{{people[index].phone}}</span>
						<Input v-else style="width: 90%;" v-model="people[index].phone" placeholder="请填写联系方式" maxlength="30"></Input>
					</td>
					<td>
						<span v-if="ifedit">{{people[index].duty}}</span>
						<Select v-else style="width:90%" v-model="people[index].duty" :transfer="true" filterable allow-create @on-create="createDuty"
						 placeholder="请选择工作职责">
							<Option v-for="item in dutyList" :value="item.value" :key="item.value">{{ item.label }}</Option>
						</Select>
					</td>
					<td>
						<template v-if="ifedit">
							<span>{{people[index].outterCompany}}</span>
						</template>
						<template v-else-if="( (!ifedit) && (people[index].companyList!=undefined && people[index].companyList!=null) )">
							<Input v-if="(people[index].companyList.length==0)" style="width: 90%;" v-model="people[index].outterCompany"
							 placeholder="请填写所属组织"></Input>
							<Select v-else style="width:90%" v-model="people[index].outterCompany" :transfer="true" filterable
							 :label-in-value='true' placeholder="请选择所属组织">
								<Option v-for="item in people[index].companyList" :value="item.gName" :key="item.gName">{{ item.gName }}</Option>
							</Select>
						</template>
						<template v-else>
							<Input style="width: 90%;" v-model="people[index].outterCompany"></Input>
						</template>
					</td>
					<td v-if="!print" style="width:18%">
						<Button v-if="!ifedit" type="warning" size="small" @click="removeRow(index)">删除</Button>
						<Button type="primary" size="small" @click="expandRow(index)">{{(item.isExpand < 0)?'展开':'收起'}}</Button>
						<Button v-if="!ifedit" type="primary" size="small" @click="copyRow(index)">复制</Button>
					</td>
					</Form>
				</tr>
				<tr v-show="item.isExpand >= 0 || print">
					<td colspan="7">
						<Form ref="people[index]" :model="people[index]" label-position="left" :label-width="120" style="position:relative;left:4%;padding:1%;">
							<Divider style="right:4%">申请账号和相关权限</Divider>
							<Row>
								<Col span="12">
								<FormItem :required="true">
									<template slot="label">
										<span>帐号使用期限：</span>
										<Tooltip content="默认申请期限不超过1年" max-width="200" placement="right" :transfer="true" style="white-space: normal;">
											<Icon type="md-help-circle" />
										</Tooltip>
									</template>
									<Input v-if="ifedit" style="width: 90%;" v-model="people[index].date" :readonly="true"></Input>
									<DatePicker v-else v-model="people[index].date" type="date" placeholder="请选择账号使用期限" format="yyyy-MM-dd" style="width:80%"
									 @on-change="dateFormat(index,$event)" :options="options" :disabled="ifedit" :clearable="false"></DatePicker>
								</FormItem>
								</Col>
								<Col span="12">
								<FormItem label="已有账号名：">
									<Input v-model="people[index].exAccount" style="width:80%" :readonly="ifedit" />
								</FormItem>
								</Col>
							</Row>
							<Row>
								<Col span="24">
								<FormItem label="账号类型：">
									<Col span="24" v-if="ifedit?people[index].isSever:(people[index].isSever || people[index].accountTypes.indexOf('主机账号')>-1)">
									<Checkbox v-model="people[index].isSever" @on-change="changeSever(index)" :disabled="ifedit">
										<span>主机账号</span>
									</Checkbox>
									<table border="1px" class="tale" style="position:relative;left:2%;max-width:90%" v-if="people[index].isSever">
										<tr align="center" class="tale_title">
											<th>
												<label class="myLabel">账号属性</label>
											</th>
											<th>
												<label class="myLabel">设备IP地址</label>
											</th>
											<th>
												<label>设备名称</label>
											</th>
											<th>
												<label>组读和执行权限目录</label>
											</th>
											<th>
												<label>该用户组需写权限目录</label>
											</th>
											<td v-if="!ifedit">
												<Button type="primary" size="small" @click="addServer(index)" :disabled="ifedit">新增</Button>
											</td>
										</tr>
										<template v-for="(ser, ser_index) in people[index].severs">
											<tr align="center" style="height:50px">
												<td style="width:8%">
													<span v-if="ifedit">{{people[index].severs[ser_index].accountAttr}}</span>
													<Select v-else v-model="people[index].severs[ser_index].accountAttr" style="width:90%">
														<Option v-for="item in attrList" :value="item.value" :key="item.value">{{ item.label }}</Option>
													</Select>
												</td>
												<td style="width:10%">
													<span v-if="ifedit">{{people[index].severs[ser_index].ip}}</span>
													<Input v-else style="width: 90%;" v-model="people[index].severs[ser_index].ip"></Input>
												</td>
												<td style="width:10%">
													<span v-if="ifedit">{{people[index].severs[ser_index].sname}}</span>
													<Input v-else style="width:90%;" v-model="people[index].severs[ser_index].sname"></Input>
												</td>
												<td style="width:10%">
													<span v-if="ifedit">{{people[index].severs[ser_index].rxPath}}</span>
													<Input v-else style="width: 90%;" v-model="people[index].severs[ser_index].rxPath"></Input>
												</td>
												<td style="width:10%">
													<span v-if="ifedit">{{people[index].severs[ser_index].wpath}}</span>
													<Input v-else style="width: 90%;" v-model="people[index].severs[ser_index].wpath"></Input>
												</td>
												<td style="width:5%" v-if="!ifedit">
													<Button type="warning" size="small" @click="removeServer(index,ser_index)" :disabled="ifedit">删除</Button>
												</td>
											</tr>
										</template>
									</table>
									</Col>
									<Col span="24" v-if="ifedit?people[index].isDb:(people[index].isDb || people[index].accountTypes.indexOf('数据库账号')>-1)">
									<Checkbox v-model="people[index].isDb" @on-change="changeDb(index)" :disabled="ifedit">
										<span>数据库账号</span>
									</Checkbox>
									<table border="1px" class="tale" style="position:relative;left:2%;max-width:90%" v-if="people[index].isDb">
										<tr align="center" class="tale_title">
											<th>
												<label class="myLabel">数据库类型</label>
											</th>
											<th>
												<label class="myLabel">账号属性</label>
											</th>
											<th>
												<label class="myLabel">设备IP地址</label>
											</th>
											<th>
												<label>资源池/设备名称</label>
												<Tooltip content="数据库类型为GBase或Vertica时必填" max-width="200" placement="right" :transfer="true" style="white-space: normal;width: 10px">
													<Icon type="md-help-circle" />
												</Tooltip>
											</th>
											<th>
												<label>schema/集群名</label>
												<Tooltip content="数据库类型为GBase或Vertica时必填:申请Vertica请填写schema;申请GBase请填写集群名" max-width="200" placement="right" :transfer="true" style="white-space: normal;width: 10px">
													<Icon type="md-help-circle" />
												</Tooltip>
											</th>
											<th>
												<label class="myLabel">权限</label>
											</th>
											<th>
												<label>库名</label>
											</th>
											<th>
												<label>表名</label>
											</th>
											<td v-if="!ifedit">
												<Button type="primary" size="small" @click="addDB(index)" :disabled="ifedit">新增</Button>
											</td>
										</tr>
										<template v-for="(db, db_index) in people[index].dbs">
											<tr align="center" style="height:50px">
												<td style="width:10%">
													<span v-if="ifedit">{{people[index].dbs[db_index].dbType}}</span>
													<Select v-else v-model="people[index].dbs[db_index].dbType" style="width:90%">
														<Option v-for="item in dbTypeList" :value="item.value" :key="item.value">{{ item.label }}</Option>
													</Select>
												</td>
												<td style="width:10%">
													<span v-if="ifedit">{{people[index].dbs[db_index].accountAttr}}</span>
													<Select v-else v-model="people[index].dbs[db_index].accountAttr" style="width:90%">
														<Option v-for="item in attrList" :value="item.value" :key="item.value">{{ item.label }}</Option>
													</Select>
												</td>
												<td style="width:10%">
													<span v-if="ifedit">{{people[index].dbs[db_index].ip}}</span>
													<Input v-else style="width: 90%;" v-model="people[index].dbs[db_index].ip"></Input>
												</td>
												<td style="width:10%">
													<span v-if="ifedit">{{people[index].dbs[db_index].sname}}</span>
													<Input v-else style="width:90%;" v-model="people[index].dbs[db_index].sname"></Input>
												</td>
												<td style="width:10%">
													<span v-if="ifedit">{{people[index].dbs[db_index].schema}}</span>
													<Input v-else style="width:90%;" v-model="people[index].dbs[db_index].schema"></Input>
												</td>
												<td style="width:10%">
													<span v-if="ifedit">{{people[index].dbs[db_index].auth}}</span>
													<Input v-else style="width: 90%;" v-model="people[index].dbs[db_index].auth"></Input>
												</td>
												<td style="width:10%">
													<span v-if="ifedit">{{people[index].dbs[db_index].dbName}}</span>
													<Input v-else style="width: 90%;" v-model="people[index].dbs[db_index].dbName"></Input>
												</td>
												<td style="width:10%">
													<span v-if="ifedit">{{people[index].dbs[db_index].tableName}}</span>
													<Input v-else style="width: 90%;" v-model="people[index].dbs[db_index].tableName"></Input>
												</td>
												<td style="width:8%" v-if="!ifedit">
													<Button type="warning" size="small" @click="removeDB(index,db_index)" :disabled="ifedit">删除</Button>
												</td>
											</tr>
										</template>
									</table>
									</Col>
									<Col span="24" v-if="ifedit?people[index].isHadoop:(people[index].isHadoop || people[index].accountTypes.indexOf('Hadoop账号')>-1)">
									<Checkbox v-model="people[index].isHadoop" @on-change="changeHadoop(index)" :disabled="ifedit">
										<span>Hadoop账号</span>
									</Checkbox>
									<table border="1px" class="tale" style="position:relative;left:2%;max-width:90%" v-if="people[index].isHadoop">
										<tr align="center" class="tale_title">
											<th>
												<label class="myLabel">keytab描述</label>
											</th>
											<th>
												<label class="myLabel">Hadoop组件</label>
											</th>
											<th>
												<label class="myLabel">具体权限描述</label>
											</th>
											<td v-if="!ifedit">
												<Button type="primary" size="small" @click="addHadoop(index)" :disabled="ifedit">新增</Button>
											</td>
										</tr>
										<template v-for="(hadoop, ha_index) in people[index].hadoops">
											<tr align="center" style="height:50px">
												<td style="width:20%">
													<span v-if="ifedit">{{people[index].hadoops[ha_index].keytab}}</span>
													<Input v-else style="width:90%;" v-model="people[index].hadoops[ha_index].keytab"></Input>
												</td>
												<td style="width:15%">
													<span v-if="ifedit">{{people[index].hadoops[ha_index].hadoopAccountType}}</span>
													<Select v-else filterable v-model="people[index].hadoops[ha_index].hadoopAccountType" style="width:90%">
														<Option v-for="item in hadoopList" :value="item.value" :key="item.value">{{ item.label }}</Option>
													</Select>
												</td>
												<td>
													<span v-if="ifedit">{{people[index].hadoops[ha_index].auth}}</span>
													<Input v-else style="width: 90%;" v-model="people[index].hadoops[ha_index].auth"></Input>
												</td>
												<td style="width:8%" v-if="!ifedit">
													<Button type="warning" size="small" @click="removeHadoop(index,ha_index)" :disabled="ifedit">删除</Button>
												</td>
											</tr>
										</template>
									</table>
									</Col>
									<Col span="24" v-if="ifedit?people[index].isHftp:(people[index].isHftp || people[index].accountTypes.indexOf('UAP账号')>-1)">
									<Checkbox v-model="people[index].isHftp" @on-change="changeUap(index)" :disabled="ifedit">
										<span>UAP账号</span>
									</Checkbox>
									<template v-if="people[index].isHftp">
										<Row>
											<Col style="left:2%">
											<label class="myLabel">场景说明：</label>
											</Col>
											<Col style="left:2%">
											<Checkbox v-model="people[index].hftps[0].isCluster" :disabled="ifedit">
												<span>采集交换集群与租户集群数据流转</span>
											</Checkbox>
											</Col>
											<Col style="left:2%">
											<Checkbox v-model="people[index].hftps[0].isPerson" :disabled="ifedit">
												<span>采集交换集群与租户个人FTP数据流转</span>
											</Checkbox>
											</Col>
											<Col style="left:2%">
											<Checkbox v-model="people[index].hftps[0].isPro" :disabled="ifedit">
												<span>采集交换集群与生产集群（如Hadoop三期二生产集群）数据流转</span>
											</Checkbox>
											</Col>
										</Row>
									</template>
									</Col>
									<Col span="24" v-if="ifedit?people[index].isPaas:(people[index].isPaas || people[index].accountTypes.indexOf('PaaS门户账号')>-1)">
									<Checkbox v-model="people[index].isPaas" @on-change="changePaas(index)" :disabled="ifedit">
										<span>PaaS门户账号</span>
									</Checkbox>
									<template v-if="people[index].isPaas">
										<Row style="left:2%">
											<Col span="11">
											<FormItem label="账号类型：" :label-width="120" :required="true">
												<Select v-model="people[index].paas[0].paasType" style="width:43%" :disabled="ifedit">
													<Option v-for="item in paasList" :value="item.value" :key="item.value">{{ item.label }}</Option>
												</Select>
											</FormItem>
											</Col>
										</Row>
									</template>
									</Col>
									<Col span="24" v-if="ifedit?people[index].isDacp:(people[index].isDacp || people[index].accountTypes.indexOf('DACP账号')>-1)">
									<Checkbox v-model="people[index].isDacp" @on-change="changeDacp(index)" :disabled="ifedit">
										<span>DACP账号</span>
									</Checkbox>
									<template v-if="people[index].isDacp">
										<Row style="left:2%">
											<Col span="11">
											<FormItem label="账号类型：" :label-width="120" :required="true">
												<Select v-model="people[index].dacps[0].dacpAccoutType" style="width:43%" :disabled="ifedit">
													<Option v-for="item in dacpList" :value="item.value" :key="item.value">{{ item.label }}</Option>
												</Select>
											</FormItem>
											</Col>
										</Row>
									</template>
									</Col>
									<Col span="24" v-if="ifedit?people[index].isElse:(people[index].isElse || people[index].accountTypes.indexOf('其他权限内容')>-1)">
									<Checkbox v-model="people[index].isElse" @on-change="changeElse(index)" :disabled="ifedit">
										<span>其他权限内容</span>
									</Checkbox>
									<template v-if="people[index].isElse">
										<label class="myLabel"></label>
										<Input v-model="people[index].elseAuthes[0].des" size="small" style="width:40%;padding-top: 5px" :readonly="ifedit" type="textarea" :autosize="true"/>
									</template>
									</Col>
								</FormItem>
								</Col>
							</Row>
						</Form>
					</td>
				</tr>
			</template>
		</table>
	</div>
</template>

<script>
	import ajax from "../../../ajax_util"
	import inputSearch from '../../../base/input_search.vue'
	export default {
		name: "account_utils",
		components: {
			inputSearch
		},
		data() {
			return {
				options: {
					disabledDate(date) {
						var now = Date.now();
						var temp = new Date(now);
						var nextYear = temp.getFullYear() + 1;
						var month = temp.getMonth() + 1;
						var day = temp.getDate();
						var t = nextYear + "-" + month + "-" + day;
						var endTime = new Date(t).valueOf()
						return date && (date.valueOf() < Date.now() - 86400000 || date.valueOf() > endTime);
					}
				},
				attrList: [
					{
						value: "个人实名制账号",
						label: "个人实名制账号"
					},
					{
						value: "程序内置账号",
						label: "程序内置账号"
					},
					{
						value: "超级用户账号",
						label: "超级用户账号"
					},
					{
						value: "FTP账号",
						label: "FTP账号"
					},
					{
						value: "前台账号",
						label: "前台账号"
					}
				],
				dbTypeList: [
					{
						value: "Mysql",
						label: "Mysql"
					},
					{
						value: "GBase",
						label: "GBase"
					},
					{
						value: "Vertica",
						label: "Vertica"
					},
					{
						value: "其他",
						label: "其他"
					}
				],
				paasList: [{
						value: "paas_huawei",
						label: "华为PaaS"
					},
					{
						value: "paas_asia",
						label: "亚信PaaS"
					}
				],
				dacpList: [{
						value: "平台管理",
						label: "平台管理"
					},
					{
						value: "开发管理(团队管理员)",
						label: "开发管理(团队管理员)"
					},
					{
						value: "数据开发(团队成员)",
						label: "数据开发(团队成员)"
					}
				],
				hadoopList: [{
						value: "HDFS",
						label: "HDFS"
					},
					{
						value: "Hive",
						label: "Hive"
					},
					{
						value: "HBase",
						label: "HBase"
					},
					{
						value: "Kafka",
						label: "Kafka"
					},
					{
						value: "Flume",
						label: "Flume"
					},
					{
						value: "UDF",
						label: "UDF"
					},
					{
						value: "HFTP",
						label: "HFTP"
					},
					{
						value: "其他",
						label: "其他"
					}
				],
				sysList:[]
			}
		},
		computed: {
			people: {
				get: function() {
					return this.value;
				},
				set: function(value) {
					this.$emit('input', value);
				}
			},
		},
		mounted: function() {
			this.getSys();
		},
		methods: {
			getSys() {
				var that = this;
				var url = this.CONFIG.progress_url + '/system-map/for/account';
				ajax.get({
					that: that,
					url: url,
					success: function(data) {
						that.sysList = data;
						console.log("---sysList-------",data, that.people);

						if(that.people != undefined && that.people != null && that.people.length > 0){
							for(var i=0; i<that.people.length; i++){
								if(that.people[i].sysId != undefined && that.people[i].sysId != null && that.people[i].sysId > 0){
									that.sysList.some(item=>{
										if(item.id == that.people[i].sysId){
											that.people[i].accountTypes = item.accountTypes;
											return true;
										}
									})
								}
							}
							// that.$forceUpdate();
						}
					}
				})
			},
			selectSys(data,index) {
				console.log("========sys======", data);
				this.people[index].sysName = data.label;

				this.sysList.some(item=>{
					if(item.id == data.value){
						this.people[index].accountTypes = item.accountTypes;
						return true;
					}
				})

				// this.$forceUpdate();
			},
			addRow() {
				this.people.push({
					isExpand: 0,
					date: "",
					isSever: false,
					isDb: false,
					isHadoop: false,
					isHftp: false,
					isPaas: false,
					isDacp: false,
					isElse: false,
					companyList: [],

		            baseId: 0,
		            commons: [{
			            accountType: 0,
			            deadline: 0,
			            des: "",
			            id: 0,
			            json: "",
			            peopleId: 0,
			            status: 0,
			            subAccount: ""
		            }],
		            dacps: [],
		            dbs: [],
		            deadline: 0,
		            duty: "",
		            elseAuthes: [],
		            exAccount: "",
		            fourA: "",
		            hadoops: [],
		            hftps: [],
		            id: 0,
		            igroup: "",
		            outterCompany: "",
		            outterCompanyId: 0,
		            paas: [],
		            peopleName: "",
		            peopleType: 0,
		            peopleUserId: 0,
		            phone: "",
		            severs: [],
		            tenantName: "",
		            sysId: 0,
		            sysName: "",
		            accountTypes:[],
		            selectTypes:[],
		        });
		        this.getNextYear(this.people.length - 1);
		    },
		    getNextYear(index) {
		        var now = Date.now();
		        var temp = new Date(now);
		        var nextYear = temp.getFullYear() + 1;
		        var month = temp.getMonth() + 1;
		        var day = temp.getDate();
		        var date = nextYear + "-" + month + "-" + day;
		        this.people[index].date = date;
		        this.dateFormat(index, date);
		    },
		    dateFormat(index, event) {
		        this.people[index].date = event;
		        var date = new Date(this.people[index].date);
		        this.people[index].deadline = (date.getTime() / 1000);
		    },
		    changePeople(list, index) {
		        //console.log("00000000");
		        console.log("----changePeople---------", list);
		        console.log("========", !this.ifedit);
		        if (!this.ifedit) {
		          //console.log("----changePeople---------",list,index,typeof(list[0].id));
		          this.people[index].companyList = [];
		          if (list[0] != undefined) {
		            if ((list[0].id > 0) && (typeof(list[0].id) === "number")) {
		              this.people[index].peopleUserId = list[0].id;
		              this.people[index].peopleName = list[0].user_name;
		              //this.people[index].fourA = list[0].fourA;
		              //this.people[index].phone = list[0].phone;
		              var that = this;
		              var url = this.CONFIG.url_know + '/getCom-FourA/' + this.people[index].peopleUserId;
		              ajax.get({
		                that: that,
		                url: url,
		                success: function(data) {
		                  console.log("----data--------", data);
		                  that.people[index].companyList = data.structs;
		                  that.people[index].fourA = data.fourA;
		                  that.people[index].phone = data.phone;
		                }
		              })
		            } else {
		              this.people[index].fourA = "";
		              this.people[index].phone = "";
		              this.people[index].outterCompany = "";
		              this.people[index].peopleUserId = 0;
		              this.people[index].peopleName = list[0].user_name;
		              //console.log("----peopleUserId---------",this.people);
		            }
		          };
		        }
		    },
		    createDuty(val) {
		        this.dutyList.push({
		          value: val,
		          label: val
		        });
		    },
		    removeRow(index) {
		        this.people.splice(index, 1);
		    },
		    expandRow(index) {
		        if (this.people[index].isExpand < 0) {
		          this.people[index].isExpand = 0;
		        } else {
		          this.people[index].isExpand = -1;
		        }
		    },
		    copyRow(index) {
		        var temp = JSON.stringify(this.people[index]);
		        var people = JSON.parse(temp);
		        //console.log("!!!!!!!!",people);

		        this.people.push({
		          isExpand: 0,
		          date: people.date,
		          isSever: people.isSever,
		          isDb: people.isDb,
		          isHadoop: people.isHadoop,
		          isHftp: people.isHftp,
		          isPaas: people.isPaas,
		          isDacp: people.isDacp,
		          isElse: people.isElse,
		          companyList: [],

		          baseId: 0,
		          commons: [{
		            accountType: 0,
		            deadline: 0,
		            des: "",
		            id: 0,
		            json: "",
		            peopleId: 0,
		            status: 0,
		            subAccount: ""
		          }],
		          dacps: people.dacps,
		          dbs: people.dbs,
		          deadline: people.deadline,
		          duty: "",
		          elseAuthes: people.elseAuthes,
		          exAccount: people.exAccount,
		          fourA: "",
		          hadoops: people.hadoops,
		          hftps: people.hftps,
		          id: 0,
		          igroup: "",
		          outterCompany: "",
		          outterCompanyId: 0,
		          paas: people.paas,
		          peopleName: "",
		          peopleType: 0,
		          peopleUserId: 0,
		          phone: "",
		          severs: people.severs,
		          tenantName: "",
		          sysId:people.sysId,
		          sysName:people.sysName,
		          accountTypes:people.accountTypes,
		          selectTypes:people.selectTypes,
		        });
		        console.log("==========", this.people[this.people.length - 1]);
		    },
		    addServer(index) {
		        this.people[index].severs.push({
		          accountAttr: "",
		          deadline: 0,
		          id: 0,
		          ip: "",
		          peopleId: 0,
		          rxPath: "",
		          sname: "",
		          status: 0,
		          subAccount: "",
		          wpath: ""
		        });
		    },
		    removeServer(index, ser_index) {
		        this.people[index].severs.splice(ser_index, 1);
		    },
		    addDB(index) {
		        this.people[index].dbs.push({
		          accountAttr: "",
		          auth: "",
		          dbName: "",
		          dbType: "",
		          deadline: 0,
		          id: 0,
		          ip: "",
		          peopleId: 0,
		          sname: "",
		          status: 0,
		          subAccount: "",
		          tableName: "",
		          schema:""
		        });
		    },
		    removeDB(index, db_index) {
		        this.people[index].dbs.splice(db_index, 1);
		    },
		    addHadoop(index) {
		        this.people[index].hadoops.push({
		          hadoopAccountType: "",
		          auth: "",
		          cpu: 10,
		          deadline: 0,
		          hdfs: "100G",
		          keytab: "",
		          id: 0,
		          mem: 40,
		          peopleId: 0,
		          status: 0,
		          subAccount: ""
		        });
		    },
		    removeHadoop(index, ha_index) {
		        this.people[index].hadoops.splice(ha_index, 1);
		    },
		    changeSever(index) {
		        this.people[index].severs = [];
		        if (this.people[index].isSever) {
		          this.people[index].severs.push({
		            accountAttr: "",
		            deadline: 0,
		            id: 0,
		            ip: "",
		            peopleId: 0,
		            rxPath: "",
		            sname: "",
		            status: 0,
		            subAccount: "",
		            wpath: ""
		          });

		          this.people[index].selectTypes.push("主机账号");
		        }else{
		        	var i = this.people[index].selectTypes.indexOf("主机账号");
		        	this.people[index].selectTypes.splice(i,1);
		        }
		    },
		    changeDb(index) {
		        this.people[index].dbs = [];
		        if (this.people[index].isDb) {
		          this.people[index].dbs.push({
		            accountAttr: "",
		            auth: "",
		            dbName: "",
		            dbType: "",
		            deadline: 0,
		            id: 0,
		            ip: "",
		            peopleId: 0,
		            sname: "",
		            status: 0,
		            subAccount: "",
		            tableName: "",
		            schema:""
		          });

		          this.people[index].selectTypes.push("数据库账号");
		        }else{
		        	var i = this.people[index].selectTypes.indexOf("数据库账号");
		        	this.people[index].selectTypes.splice(i,1);
		        }
		    },
		    changeHadoop(index) {
		        this.people[index].hadoops = [];
		        if (this.people[index].isHadoop) {
		          this.people[index].hadoops.push({
		          	hadoopAccountType: "",
		          	auth: "",
		            cpu: 10,
		            deadline: 0,
		            hdfs: "100G",
		            keytab: "",
		            id: 0,
		            mem: 40,
		            peopleId: 0,
		            status: 0,
		            subAccount: ""
		          });

		          this.people[index].selectTypes.push("Hadoop账号");
		        }else{
		        	var i = this.people[index].selectTypes.indexOf("Hadoop账号");
		        	this.people[index].selectTypes.splice(i,1);
		        }
		    },
		    changeUap(index) {
		        this.people[index].hftps = [];
		        if (this.people[index].isHftp) {
		          this.people[index].hftps.push({
		            deadline: 0,
		            id: 0,
		            isCluster: false,
		            isPerson: false,
		            isPro: false,
		            peopleId: 0,
		            status: 0,
		            subAccount: ""
		          });

		          this.people[index].selectTypes.push("UAP账号");
		        }else{
		        	var i = this.people[index].selectTypes.indexOf("UAP账号");
		        	this.people[index].selectTypes.splice(i,1);
		        }
		    },
		    changePaas(index) {
		        this.people[index].paas = [];
		        if (this.people[index].isPaas) {
		          this.people[index].paas.push({
		            deadline: 0,
		            id: 0,
		            paasType: "",
		            peopleId: 0,
		            status: 0,
		            subAccount: ""
		          });

		          this.people[index].selectTypes.push("PaaS门户账号");
		        }else{
		        	var i = this.people[index].selectTypes.indexOf("PaaS门户账号");
		        	this.people[index].selectTypes.splice(i,1);
		        }
		    },
		    changeDacp(index) {
		        this.people[index].dacps = [];
		        if (this.people[index].isDacp) {
		          this.people[index].dacps.push({
		            dacpAccoutType: "",
		            deadline: 0,
		            id: 0,
		            peopleId: 0,
		            status: 0,
		            subAccount: ""
		          });

		          this.people[index].selectTypes.push("DACP账号");
		        }else{
		        	var i = this.people[index].selectTypes.indexOf("DACP账号");
		        	this.people[index].selectTypes.splice(i,1);
		        }
		    },
		    changeElse(index) {
		        this.people[index].elseAuthes = [];
		        if (this.people[index].isElse) {
		          this.people[index].elseAuthes.push({
		            deadline: 0,
		            des: "",
		            id: 0,
		            peopleId: 0,
		            status: 0,
		            subAccount: ""
		          });

		          this.people[index].selectTypes.push("其他权限内容");
		        }else{
		        	var i = this.people[index].selectTypes.indexOf("其他权限内容");
		        	this.people[index].selectTypes.splice(i,1);
		        }
		    },
		    isContained(selectTypes){
		    	this.sysList.forEach(item=>{
		    		item.isDisabled = false;
		    		var accountTypes = item.accountTypes;

				    if(!(accountTypes instanceof Array) || !(selectTypes instanceof Array)){
				    	item.isDisabled = true;
				    }else if(accountTypes.length < selectTypes.length){
				    	item.isDisabled = true;
				    }else{
					    var aStr = accountTypes.toString();
						console.log("aaaaaaaaaa",aStr);

					    for(var i = 0, len = selectTypes.length; i < len; i++){
							console.log("bbbbbbbbbbbb", aStr.indexOf(selectTypes[i]));
					        if(aStr.indexOf(selectTypes[i]) < 0){
					       		item.isDisabled = true;
					       		break;
					        }
					    }
				    }

		    	})
		    	// this.$forceUpdate();
		    	console.log("isContained", this.sysList, selectTypes);
		    }
		},
		props: {
			value: {},
			ifedit: {},
			peopleList: {},
			dutyList: {},
			print: {
				default: false
			}
		}
	}
</script>

<style lang="scss" scoped>
	@import "../../../utils/base.scss";

	.myLabel:before {
		content: '*';
		display: inline-block;
		margin-right: 4px;
		line-height: 1;
		font-family: SimSun;
		font-size: 14px;
		color: #ed4014;
	}

	.myInput {
		border: 1px solid #ed4014
	}

	.myForm {
		position: relative;
		line-height: 32px;
		font-size: 14px;
	}

    .p_content{
        font-size:13px;
        min-width: 100px;
        max-width: 200px;
        height: auto;
        word-wrap:break-word;
        word-break:break-all;
        overflow: hidden;
        padding-bottom: 4px;
    }

</style>
